<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>登录验证</title>
		<style type="text/css">
			.wrap
			{
				width: 400px;
				border: 1px solid #000;
				text-align: center;
				margin:200px auto;
			}
			input
			{
				margin-top: 10px;
			}
			input[type=password]
			{
			margin-left: 16px;
			}
		</style>
	</head>
	<body>
		<div class="wrap">
		     用户名:
			<input type="text" name="" id="username" value="" /><br>
			 密码: 
			<input type="password" name="" id="password" value="" /><br>
			<input type="button" name="" id="tologin" value="登录" />
		</div>
		<script type="text/javascript">
			let uname = document.getElementById("username");
			let pwd = document.getElementById("password");
			let tologin= document.getElementById("tologin");
			let persons = [
				{"username":"xiaoming1","password":"111"},
				{"username":"xiaoming2","password":"222"},
				{"username":"xiaoming3","password":"33333"},
			];
			// let persons = [
			//     ​	{"username":"xiaoming1","password":"1111"},
			//     ​	{"username":"xiaoming2","password":"222"},
			//     ​	{"username":"xiaoming3","password":"33333"}
			// ];
			 let user = {};
			 //点击登录
			 tologin.onclick=function()
			 {
				 if(username.value == "" && pwd.value == "")
				 {
					 alert("用户名或密码不得为空");
				 }
				 else
				 {
				       user.username = uname.value;   //用户名
				       user.password = pwd.value;	  //密码
					   let arr = persons.filter((value)=>{
						   return value.username == user.username && value.password == user.password
					   })
					   if(arr.length==1)
					   {
						   alert("登录成功");
					   }
					   else
					   {
						   persons.push(user)
						}
					   
				 }
				console.log(persons);
			 }
			
		</script>
	</body>
</html>
